<script setup>
import TimeLine from "./TimeLine.vue"
import CalendarComp from "./CalendarComp.vue"
import SharePage from './SharePage.vue'
import PageMap from "./PageMap.vue"
import PageAlbum from "./PageAlbum.vue"
import { useRoute } from "vue-router"
import { useNote } from "@/stores/note"
import ToDo from "@/components/Note/pages/ToDo.vue";
const route = useRoute();

// const activeName = ref('Timeline') // 默认标签页
const activeName = ref('ToDo') // 默认标签页
const Note = useNote()
window.Note = Note.init()

// 如果有share参数，直接跳转分享页
if (route.query.share) activeName.value = 'Share';
</script>

<template>
  <el-tabs v-model="activeName" class="demo-tabs model" style="padding:10px">
    <el-tab-pane label="时间线" name="Timeline" style="padding:0 10px" lazy="false">
      <TimeLine v-if="activeName === 'Timeline'" />
    </el-tab-pane>
    <el-tab-pane label="日历" name="Calendar" lazy="false">
      <CalendarComp />
    </el-tab-pane>
    <el-tab-pane label="相册" name="Album" lazy="false">
      <PageAlbum v-if="Note.status" />
      <div v-else>请先登录</div>
    </el-tab-pane>
    <el-tab-pane label="地图" name="Map" lazy="false">
      <PageMap v-if="Note.status" />
      <div v-else>请先登录</div>
    </el-tab-pane>
    <el-tab-pane label="待办" name="ToDo" lazy="false">
      <ToDo v-if="Note.status" />
      <div v-else>请先登录</div>
    </el-tab-pane>
    <el-tab-pane v-if="route.query.share" label="分享" name="Share" style="padding:0 10px">
      <SharePage />
    </el-tab-pane>
  </el-tabs>
</template>

<style scoped></style>

<style>
/* 左边距 */
.demo-tabs .el-tabs__nav {
  margin-left: 30px;
}
</style>